<template>
  <div class="pagebody">
    <StickHead></StickHead>
    <div class="headtop bgfff text-al-center fz30">{{typename=="myproblemlist"?"我的问题":typename=="agency"?"我的待办":typename=="completed"?"我的已办":"全部工单"}}</div>
    <ul class="problemlist borderbox">
      <li  v-for="(item) in problemlist"
          :key="item.id"
          @click="toDetail(item.id)" class=" br20 borderbox bgfff flex-row justify-between">
        <div class="left fz24">
         {{item.title}}
        </div>
        
        <div class="right over fz24 flex-row align-center justify-center" v-if="item.resolved==1"><van-icon class="mr5" size="0.34rem" name="passed" color="#03B45D" />已解决</div>
        <div class="right load fz24 flex-row align-center justify-center" v-else><van-icon class="mr5" size="0.34rem" name="more-o" color="#1A89F0" />处理中</div>

      </li>
    </ul>
    <div class="fz24 bgF4 color909399 align-center justify-center" style="height:0.88rem">没有更多数据了</div>
    <StickFoot v-if="typename=='myproblemlist'" :type="'myself'"></StickFoot>
    <StickFoot v-else :type="'index'"></StickFoot>


  </div>
</template>

<script>
import { getQuestionList } from "@/api/api";
import StickHead from "@/layout/StickHead.vue";
import StickFoot from "@/layout/StickFoot.vue";
export default {
  name: "myproblemlist",
  components: {
    StickHead,
    StickFoot
  },
  data() {
    return {
      typename: "",
      problemlist:[],
      flag:"",
      createBy:"",
      userinfo:{}
    }
  },
  created() {
    this.typename = this.$route.name;
    this.flag = this.$route.query.flag;
  },
  mounted() {
    this.userinfo = JSON.parse(window.localStorage.getItem("userinfo"));
    this.getQuestionList();
  },
  methods: {
    getQuestionList() {
      if(this.flag==0){
        this.flag=0;
      }else if(this.flag==1){
        this.flag=1;
      }else if(this.flag==2){
        this.flag=2;
      }

      let params = {
        createBy:this.userinfo.userId,
        flag:this.flag,
      };
      getQuestionList(params).then((response) => {
        this.problemlist = response.data.rows;
      });
    },
    toDetail(id) {
      this.$router.push({ name: "problemdetil", params: { id: id },query:{flag:this.flag} });
    }
  },
};
</script>

<style lang="scss" scoped>
.pagebody {
  background-color: #f6f8fb;
  .headtop {
    line-height: 0.8rem;
    height: 0.8rem;
  }
  .problemlist{
    padding: 0.24rem;
    li{
      padding: 0.16rem;
      margin-bottom: 0.24rem;
      .left{
        width: 5rem;
      }
     .right{
      width: 1.5rem;
     }
     .over{
      color: #03B45D;
     }
     .load{
      color: #1A89F0;
     }

    }
  }
}
</style>